<template>
  <div class="mui-pages">
    <header class="mui-bar mui-bar-nav">
      <div class="header-common-title flex-justify-start">
        <span @click="fn.back()" class="mui-action-back"><img class="back-btn" src="../../../../static/images/back.png"></span>
        <div class="header-search flex-center">选择人员</div>
        <div @click="save()" class="header-right-btn flex-center">确定</div>
      </div>
    </header>
    <div class="message-tab flex-between-center people-header types-lists">
      <div v-if="isShowSelectAll()"  class="mui-input-row mui-checkbox mui-left flex-center active-select">
        <input v-model="allCheck" name="checkbox" value="Item 2" type="checkbox" style="position: static;">
        <p @click="selectAll()" class="people-header-title ">支部全体党员</p>
      </div>
      <div class="header-search" :class="{'full-search':!isShowSelectAll()}">
        <input type="search"  v-model="searchName" placeholder="请输入姓名搜索" />
        <i class="people-search"></i>
      </div>
    </div>
    <div class="mui-scroll-wrapper mui-page-content mui-pages">
      <div class="mui-scroll">
        <ul class="work-message-lists people-lists">
          <li @click="selected(item)" v-if="item.name.indexOf(searchName)>=0" v-for="item in list" :class="{'people-select':selectedIndexOf(item)!=-1}" class="flex-justify-start ">
            <div class="people-lists-touxiang"></div>
            <p>{{item.name}}</p>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
  import footerbar from '../common/footerbar.vue'
  import tools from '@/utils/tools'
  import loginService from '@/service/loginService'
  import moment from 'moment'
  export default {
    components: {
      footerbar
    },
    name: '',
    data () {
      return {
        allCheck: false,
        searchName: '',
        fn: tools,
        options: {
          pullUpLoad: true,
          scrollbar: false
        },
        list: [],
        schedulePeopleListSelected: [],
        data: this.$store.state.scheduleDetail,
        scheduleAddData: this.$store.state.scheduleAddData,
        modelName: '',
        swipeData: [],
        infinite: true,
        pageIndex: 0
      }
    },
    created () {
      this.modelName = this.$route.params.modelName
      this.loadData()
    },
    methods: {
      selectAll () {
        this.allCheck = !this.allCheck
      },
      onPullingUp () {
        console.log('onPullingUp')
        this.loadData()
      },
      // 是否显示人员全选 选择主持人、记录人的人员列表，去掉左上部分的全体党员全选
      isShowSelectAll () {
        if (this.modelName === 'compereUserName' || this.modelName === 'recordEUserName') {
          return false
        }
        return true
      },
      selected (item) {
        let index = this.selectedIndexOf(item)
        if (index >= 0) {
          this.schedulePeopleListSelected.splice(index, 1)
        } else {
          this.schedulePeopleListSelected.push(item)
        }
      },
      selectedIndexOf (item) {
        let index = -1
        this.schedulePeopleListSelected.some((v, i) => {
          if (item.id === v.id) {
            index = i
            return false
          }
        })
        return index
      },
      // 小组
      getPartyMemberBySmallGroupIds () {
//        if (this.$store.state.scheduleAddData.scope !== 'dxz') {
//          return false
//        }
        loginService.getPartyMemberBySmallGroupIds(this.$store.state.userInfo.partyMemberModel.partyGroupId).then((res) => {
          if (res.code === 200) {
            this.list = res.data
          }
        })
      },
      getPartyMembers () {
//        if (this.$store.state.scheduleAddData.scope !== 'dzb') {
//          return false
//        }
        let data = {
          dataScope: 2
        }
        loginService.getPartyMembers(data).then((res) => {
          if (res.code === 200) {
            this.list = res.data
          }
        })
      },
      save () {
        this.$store.state['schedulePeopleListSelected' + this.modelName] = this.schedulePeopleListSelected
        let keys = []
        let values = []
        this.schedulePeopleListSelected.forEach((v) => {
          keys.push(v.id)
          values.push(v.name)
        })
        this.$store.state.scheduleAddData[this.modelName] = values.join(',')
        this.$store.state.scheduleAddData[this.modelName.replace('Name', 'Id')] = keys.join(',')
        tools.back()
      },
      loadData () {
        if (this.$store.state['schedulePeopleListSelected' + this.modelName]) {
          this.schedulePeopleListSelected = this.$store.state['schedulePeopleListSelected' + this.modelName]
        }
//        this.getPartyMemberBySmallGroupIds()
        this.getPartyMembers()
      }
    },
    watch: {
      allCheck (newValue) {
        if (newValue === true) {
          this.schedulePeopleListSelected = this.list.slice(0, this.list.length)
        } else {
          this.schedulePeopleListSelected = []
        }
      }
    }
  }
</script>
<style scoped="">
  .full-search {
    width:100%;
  }
</style>
